<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>登录</title>
    <link rel="stylesheet" href="./layui/css/layui.css" media="all" />
    <script type="text/javascript" src="jquery-1.9.1.js"></script>
    <style>

        html,body{
            height: 100%;
            margin: 0 auto;
            padding: 0;
            position: relative;
            background-image: url("image/1533790988458.jpeg");
            background-size: cover;
        }

        .wrapper{
            position: absolute;
            left:0;
            top: 0;
            bottom: 0;
            right: 0;
            margin: auto;
            width: 500px;
            height: 300px;
        }

        .head img{
            position: absolute;
            left:0;
            right: 0;
            margin: auto;
            height: 50px;
        }

        .main{
            position: relative;
            top: 60px;
            height: 240px;
        }

        .layui-form-item{
            position: relative;
            text-align: center;
            margin-top: 15px;
            left: 20%;
            width: 60%;
        }

        input{
            color: white;
            border-color: #1E9FFF;
            background: none !important;
        }

        .captcha>img{
            float: right;
            width: 40%;
            height: 38px;
            cursor:pointer;
        }

        .captcha>input{
            width: 60%;
        }

    </style>
</head>

<body>
<div class="wrapper">
    <div class="main">
        <!--<fieldset>-->

            <div class="layui-form-item">
                <input class="layui-input uname" type="text" name="username" autocomplete="off" placeholder="用户名" lay-verify="require" required/>
            </div>
            <div class="layui-form-item">
                <input class="layui-input password" type="password" name="password" autocomplete="off" placeholder="密码" lay-verify="require" required/>
            </div>

            <div class="layui-form-item">
                <!--lay-submit="" lay-filter="go"-->
                <button class="layui-btn layui-btn-normal" id="submit">登录</button>
                <button type="reset" class="layui-btn layui-btn-primary" style="margin-left: 85px">重置</button>
            </div>
    </div>

</div>

<script type="text/javascript" src="layui/layui.all.js"></script>
<script type="text/javascript">
    $(function () {
        $("#submit").click(function() {
        var username = $(".uname").val();
        var password = $(".password").val();
        var formdata = "username="+username+"&password="+password;
        console.log(formdata);
        $.ajax({
            url:"/check.do",
            type:"POST",
            data:formdata
        }).done(
            function (data) {
                if(data.msg==="登陆成功"){
                    window.alert("登陆成功");
                    window.location.href = "/main.html";
                }else{
                    window.alert("登录失败");
                    window.location.href="/Login.html";
                }
            }
        ).fail()
    });
    });
</script>
</body>

</html>